<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>读者注销申请</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <style>

        html {
            filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
            -webkit-filter: grayscale(100%);
        }
        .isCancel{
            box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
            background-color: #4CAF50; /* Green */
            border: none;
            color: white;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 6px;
            margin-left: 100px;
        }
        /*body{*/
        /*    background-image: url("/img/bg12.png");*/
        /*}*/

    </style>
</head>
<body>
<div>
    <input type="button"  class="isCancel" value="刷新" onclick="refresh()">
    <label>
        <input type="checkbox" id="pending" class="myClass" value="1" />待处理&nbsp;&nbsp;
        <input type="checkbox" id="agreed" class="myClass" value="2" />已同意&nbsp;&nbsp;
        <input type="checkbox" id="rejected" class="myClass" value="3" />已拒绝&nbsp;&nbsp;
    </label><input type="button" value="筛选" class="isCancel" id="bth"  onclick="screenCancelInfo()">
    <table class="table" >
        <thead>
        <tr>
            <th style="display: none"></th>
            <th>用户名</th>
            <th>邮箱</th>
            <th>身份证</th>
            <th>手机</th>
            <th>余额</th>
            <th>操作</th>
            <th>状态</th>
        </tr>
        </thead>
        <tbody id="cancelInfo">

        </tbody>
    </table>
</div>
</body>
</html>
<script src="/js/jquery-3.5.1.js"></script>
<script>


    getBorCancelInfo();

    function refresh() {
        getBorCancelInfo();
    }

    /**
     * 获得所有用户注销信息
     */
    function getBorCancelInfo() {
        $("#cancelInfo").empty();
        $.post("/getBorCancelInfo.admin", function (responseText) {
            appendTr(responseText);
        });
    }

    /**
     * 筛选注销状态
     */
    function screenCancelInfo() {
        let pending = $("#pending").is(":checked");
        let agreed = $("#agreed").is(":checked");
        let rejected = $("#rejected").is(":checked");

        $("#cancelInfo").empty();
        if (!pending && !agreed && !rejected) {
            getBorCancelInfo();
        } else {
            if (pending) {
                $.post("/getBorCancelInfo.admin", {isCancel: $("#pending").val()}, function (responseText) {
                    appendTr(responseText);
                });
            }
            if (agreed) {
                $.post("/getBorCancelInfo.admin", {isCancel: $("#agreed").val()}, function (responseText) {
                    appendTr(responseText);
                });
            }
            if (rejected) {
                $.post("/getBorCancelInfo.admin", {isCancel: $("#rejected").val()}, function (responseText) {
                    appendTr(responseText);
                });
            }
        }
    }

    /**
     * 往 tbody中添加查到的数据
     * @param responseText
     */
    function appendTr(responseText) {
        let obj = JSON.parse(responseText);
        for (let i = 0; i < obj.length; i++) {
            let str = "<td style='display: none'>" + obj[i].userId + "</td>>";
            str += "<td>" + obj[i].userName + "</td>>";
            str += "<td>" + obj[i].email + "</td>>";
            str += "<td>" + obj[i].idCard + "</td>>";
            str += "<td>" + obj[i].phone + "</td>>";
            str += "<td>" + obj[i].balance + "</td>>";
            switch (obj[i].isCancel) {
                case '1' :
                    str += "<td><input type='button' value='同意' onclick='agree(this)' /><input type='button' value='拒绝' id='refuseCancel' onclick='refuse(this)' /></td>"
                    str += "<td>待处理</td>";
                    break;
                case '2' :
                    str += "<td><input type='button' disabled='disabled' value='同意'/><input type='button' disabled='disabled' value='拒绝' /></td>"
                    str += "<td>已同意</td>>";
                    break;
                case '3' :
                    str += "<td><input type='button' disabled='disabled' value='同意'/><input type='button' disabled='disabled' value='拒绝' /></td>"
                    str += "<td>已拒绝</td>";
                    break;
            }
            let tr = $("<tr>" + str + "</tr>");
            $("#cancelInfo").append(tr);
        }

    }

    function agree(ele) {
        let userId = ele.parentNode.parentNode.firstChild.textContent;
        let str = "请再次确认是否拒绝该注销申请\r\n";
        let balance = ele.parentNode.parentNode.childNodes[5].textContent;
        console.log("余额:" + balance);
        str += "该账号剩余：" + balance + "￥";
        let r = confirm(str);
        if (r) {
            $.post("/updateCancel.admin", {userId: userId, isCancel: 2});
            setTimeout(function () {
                getBorCancelInfo()
            }, 100);

        }

    }

    function refuse(ele) {
        let userId = ele.parentNode.parentNode.firstChild.textContent;
        let r = confirm("请再次确认是否拒绝该注销申请");
        if (r) {
            $.post("/updateCancel.admin", {userId: userId, isCancel: 3})
            setTimeout(function () {
                getBorCancelInfo()
            }, 100);
        }
    }

</script>
